<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ page import="java.util.Date" %>
<%@ page import="java.text.SimpleDateFormat" %>
<%
    request.setCharacterEncoding("UTF-8");
    String htmlData = request.getParameter("content1") != null ? request.getParameter("content1") : "";
%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>
<%
    SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd");
    String date= format.format(new Date());
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Insert title here</title>
    <script type="text/javascript" src="<%=path%>/My97DatePicker/WdatePicker.js"></script>
    <link rel="stylesheet" type="text/css" href="<%=path%>/CSS/backLayout.css">
    <link rel="stylesheet" type="text/css" href="<%=path%>/CSS/bombBox.css">
 
</head>
<style>
    select {
        width: 234px;
        height: 31px
    }

    .tr td {
        font-size: 14px;
        color: #ffffff
    }

    .tr_td {
        height: 40px;
    }

    .tr_td td {
        border-bottom: 1px solid #ededed;
        text-align: center;
    }

    tr td:nth-child(1) {
        font-size: 14px;
        color: #cccccc
    }

    .date {
        border: 0;
        background: #ffffff;
        text-align: center;
    }

    .tr_td td:nth-child(1) {
        border-left: 1px solid #cccccc;
    }

    .tr_td td:nth-child(3) {
        border-right: 1px solid #cccccc;
    }

    .addTable.deleteTable:HOVER {
        cursor: pointer;
    }

    type[type='checkbox'] {
        width: 15px
    }

    .input_hang {
        width: 480px;
        height: 60px;
    }

    .input_hang input {
        width: 183px;
        height: 28px;
        line-height: 28px;
        border: solid 1px #cccccc;
    }

    .input_hang .gn_name {
        line-height: 30px;
        height: 30px;
    }

    .right_hang {
        padding-top: 130px;
        padding-left: 170px;
        width: 800px;
        height: 60px;
    }

    .input_hang select {
        width: 185px;
    }

</style>
<body style="background: #f5f5f5">
<div class="main">
    <div class="weizhi">
   		 预约管理>>考试预约（批量）>>新增
    </div>
   			<div id="modal-overlay">
			    
			</div>
			<div class="modal-data">
				<div style="height: 60px">
				 <ul>
				  	<li  style="text-align: left;margin-left: 60px;height: 40px;line-height: 40px">
				  		<span>名称：</span>
				  		<span>
				  		 	<input class="name" type="text" >
				  		</span>
				  		<span>
				  			<button class="findBtn">
				  				查询
				  			</button>
				  		</span>
				  	</li>
				 </ul>
				</div>
				<div style="width:100%; height:350px; overflow:scroll;">
			      <form action="">
			        <table width="100%" class="head" style="width: auto;white-space:nowrap;border-spacing: 0px">
			        <tr style="background: #f2f2f2;height: 30px;line-height: 20px;" class="sel">
			        <td style="width: 20px"></td>
			        <td>
			        	名称
			        </td>
			        <td>
			        	编码
			        </td>
			        <td>
			        	简称
			        </td>
			        <td>
			        	描述
			        </td>
			        <td>
			        	创建时间
			        </td>
			        <td>
			        	用户名
			        </td>
			        <td>
			        	最后修改时间
			        </td>
			        <td>
			        	用户名
			        </td>
			        <td>
			        	财务组织
			        </td>
			        <td>
			        	金额
			        </td>
			        </tr>
			        	<c:forEach items="${fillingCards}" var="fillingCard" >
			        	<tr style="margin-top: 45px" >
			        		<td>
			        		 <input style="width: 15px;height: 15px" type="checkbox" name="card"  value="${fillingCard.fid}">
			        		</td>
			        		<td>${fillingCard.fnameL2}</td>
			        		<td>${fillingCard.fnumber}</td>
			        		<td>${fillingCard.fsimplename}</td>
			        		<td>${fillingCard.fdescriptionL2}</td>	
			        		<td>${fillingCard.fcreatetime}</td>	
			        		<td>${fillingCard.createName}</td>	
			        		<td>${fillingCard.flastupdatetime}</td>	
			        		<td>${fillingCard.updateName}</td>	
			        		<td>${fillingCard.cfficompanyName}</td>	
			        		<td>${fillingCard.cfamount}</td>	
			        	</tr>
			        	</c:forEach>
			        </table>
			      </form>
					<button class="subtn"
							style="width: 150px;position: absolute;bottom: 25px;font-size: 16px;left: 280px">
			      	查询
			      </button>
					<button class="btn"
							style="width: 150px;position: absolute;bottom: 25px;font-size: 16px;right: 280px">
			      	关闭
			      </button>
			</div>
			</div>
    <div class="div_body" style="min-height: 500px" >
		<form action="<%=path%>/DrivingSys/selFuelCardJournal" method="post">
        <div class="div_form" style="min-height: 300px">
			
            <div class="input_hang">
                <div class="input_hang">
                    <span class="gn_name">驾校&nbsp;:&nbsp;</span>
                    <input name="cfexamdate" id="date" value="${company.fnameL2}" style="color: gray;"/>
                	 <input type="hidden" value="${company.fid}" name="comapnyId">
                </div>
                <div class="input_hang">
                    <span class="gn_name">加油卡&nbsp;:&nbsp;</span>
                    <input name="fname" id="card" style="color: gray;"/>
                    <input type="hidden" id="cardId" name="fid">
                </div>
                <div class="input_hang">
                    <span class="gn_name">开始时间&nbsp;:&nbsp;</span>
                    <input name="beginTime" id="begindate" value="${beginTime}" style="color: gray;" onclick="WdatePicker({el:'begindate',dateFmt:'yyyy-MM-dd'})" />
                    <img onclick="WdatePicker({el:'begindate',dateFmt:'yyyy-MM-dd '})" 
				            src="<%=path%>/image/date.jpg"  align="absmiddle" style="padding-left: 15px">
             	</div>
             	 <div class="input_hang">
                    <span class="gn_name">结束时间&nbsp;:&nbsp;</span>
                    <input name="endTime" id="enddate" value="${endTime}" style="color: gray;" onclick="WdatePicker({el:'enddate',dateFmt:'yyyy-MM-dd'})" />
                    <img onclick="WdatePicker({el:'enddate',dateFmt:'yyyy-MM-dd '})" 
				            src="<%=path%>/image/date.jpg"  align="absmiddle" style="padding-left: 15px">
             	</div>
            </div>
            
        </div>
            <div class="div_tj" style="margin-bottom: 200px; margin-top: 40px;">
                <div>
                    <input class="input_submit" onclick="" value="开   始" type="submit">
                </div>
                <div>
                    <input type="button" class="input_back" value="取消" />
                </div>
            </div>

        </form>
    </div>
</div>
</body>
<script type="text/javascript" src="<%=path%>/JQuery/jquery-1.8.2.js"></script>


<script type="text/javascript">

   $('#card').live('click',function(){
	   $('#modal-overlay').css('visibility','visible')
		$('.modal-data').css('visibility','visible')
   })
	
   
   $('.input_submit').click(function(){
	   if($('#card').val() == null || $('#card').val() == "" ){
		   alert("请选择加油卡")
		   return false;
	   }
   })
   
   	$('.btn').click(function(){
		$('#modal-overlay').css('visibility','hidden')
		$('.modal-data').css('visibility','hidden')
		$('input:checkbox').removeAttr('checked');
	})
	
	$('.subtn').click(function(){
		  var spCodesTemp = "";
	      $('input:checkbox[name=card]:checked').each(function(i){
	       if(0==i){
	        spCodesTemp = $(this).val();
	       }else{
	        spCodesTemp += (","+$(this).val());
	       }
	      });
	      spCodesTemp = spCodesTemp.split(",")
	      $.ajax({
			    url:'<%=path%>/DrivingSys/selFuelCardJournalById', 
			    type: "post",
			    data:{'fid':spCodesTemp[0]},
			    dataType:"json",         	
			    success: function(json) {
			    	 $('#modal-overlay').css('visibility','hidden')
					 $('.modal-data').css('visibility','hidden')
	           		 $('#card').val(json.fnameL2)
	           		 $('#cardId').val(json.fid)
				},  
				error: function(){alert('Error');} 
	 			});

	})
	
	$('.findBtn').click(function(){
	 var name=$('.name').val()
		 $.ajax({
			    url:'<%=path%>/DrivingSys/selFuelCardJournalByName', 
			    type: "post",
			    data:{'name':name},
			    dataType:"json",         	
			    success: function(json) {
	            var str=''
	            for(var i=0;i<json.length;i++) {
	               str+='<tr style="margin-top: 45px" ><td><input style="width: 15px;height: 15px" '
	               str+='type="checkbox" name="card"  value="'+json[i].fid+'"></td>'
	               if( json[i].fnumber != null){
	        	   str+='<td>'+json[i].fnameL2+'</td><td>'+json[i].fnumber+'</td>'
	               }else{
	            	str+='<td>'+json[i].fnameL2+'</td><td></td>'  
	               }
	               if(json[i].fsimplename!=null){
	            	str+='<td>'+json[i].fsimplename+'</td>'	
	               }else{
	                str+='<td></td>'   
	               }
	               if(json[i].fdescriptionL2!=null){
		            	str+='<td>'+json[i].fdescriptionL2+'</td><td>'+json[i].fcreatetime+'</td>'	
		               }else{
		                str+='<td></td><td>'+json[i].fcreatetime+'</td>'   
		               }
	               if(json[i].createName == null) {
	            	   str+='<td></td><td>'+json[i].flastupdatetime+'</td>'
	               }else{
	            	   str+='<td>'+json[i].createName+'</td><td>'+json[i].flastupdatetime+'</td>'
	               }            
	               str+='<td>'+json[i].updateName+'</td><td>'+json[i].cfficompanyName+'</td>'
	               str+='<td>'+json[i].cfamount+'</td>'
	            }
	            $(".head tr:not(':first')").remove()
	            $('.head').append(str)
				},  
 				error: function(){alert('Error');} 
 	 			});
		
	})		
</script>
</html>